<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="bootsrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/index.css">
    <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"> -->

</head>

<body>

    <!-- 介绍模块 -->
    <div class="introduction  col-lg-12">
        <h1>What we do?</h1>
        <div class="introduction_box col-lg-12">
            <ul class="introduction_items row">
                <li class="introduction_item col-lg-4">
                    <div class="item_box">
                        <img src="images/introduction2.png" class="card-img-top" alt="...">
                        <div class="card-body">
                            <h5 class="card-title">Card title</h5>
                            <p class="card-text">Some quick example text to build on the card title and make up the bulk
                                of
                                the card's content.
                            </p>
                            <a href="#" class="btn btn-primary">read me</a>
                        </div>
                    </div>
                </li>
                <li class="introduction_item col-lg-4">
                    <div class="item_box">
                        <img src="images/introduction3.png" class="card-img-top" alt="...">
                        <div class="card-body">
                            <h5 class="card-title">Card title</h5>
                            <p class="card-text">Some quick example text to build on the card title and make up the bulk
                                of
                                the card's content.
                            </p>
                            <a href="#" class="btn btn-primary">read me</a>
                        </div>
                </li>
                <li class="introduction_item col-lg-4">
                    <div class="item_box">
                        <img src="images/introduction1.png" class="card-img-top" alt="...">
                        <div class="card-body">
                            <h5 class="card-title">Card title</h5>
                            <p class="card-text">Some quick example text to build on the card title and make up the bulk
                                of
                                the card's content.
                            </p>
                            <a href="#" class="btn btn-primary">read me</a>
                        </div>
                </li>
            </ul>
        </div>
    </div>
    <!-- 怎么做模块 -->
    <div class="function">
        <h1>How we do?</h1>
        <div class="row g-2">
            <div class="col-lg-4">
                <div class="p-3">
                    <img src="images/function1.png" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">Landing Pages</h5>
                        <p class="card-text">Impress with these beautiful landing pages.</p>
                        <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="p-3">
                    <img src="images/function2.png" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">Secondary Pages</h5>
                        <p class="card-text">Awesome collection of pages for any scenario</p>
                        <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="p-3">
                    <img src="images/function3.png" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">Authentication</h5>
                        <p class="card-text">Provide users good looking forms that inspire trust.</p>
                        <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                    </div>
                </div>

            </div>
            <div class="col-lg-4">
                <div class="p-3">
                    <img src="images/function4.jpg" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">Account Pages</h5>
                        <p class="card-text">Profile and account managemend made cool.</p>
                        <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="p-3">
                    <img src="images/function5.jpg" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">Shop Pages</h5>
                        <p class="card-text">Complete front-end flow for e-commerce website.</p>
                        <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="p-3">
                    <img src="images/function6.jpg" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">Utility Pages</h5>
                        <p class="card-text">Error pages and everything else can be found here.</p>
                        <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                    </div>
                </div>
            </div>

        </div>
    </div>

</body>

</html>